{extend name="layout/main" /}

{block name="header"}

{/block}

{block name="content"}
<script src="__PUBLIC__/admin/js/laydate/laydate.js"></script>
<script src="__PUBLIC__/admin/js/wangEditor.min.js"></script>
<script type="text/javascript" src='https://cdn.staticfile.org/webuploader/0.1.5/webuploader.min.js'></script>
<link rel="stylesheet" href="https://cdn.staticfile.org/webuploader/0.1.5/webuploader.css">
<section class="panel">
    {if isset($info)}
    <header class="panel-heading">
        <h4>编辑文章</h4>
    </header>
    <div class="panel-body" style="padding-bottom: 50px">
        <form class="form-horizontal" method="post" onsubmit="return false" role="form">
            <div class="form-group">
                <label class="col-sm-2 control-label">标题</label>

                <div class="col-sm-5">
                    <input type="text" value="{$info->name}" name="name" id="name" class="form-control"
                           placeholder="请输入标题">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">分类</label>

                <div class="col-sm-5">
                    <select name="size" id="size" class="form-control">
                        {foreach $cate as $key=>$item}
                        <option value="{$item.id}">{$item.name}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">准入额</label>

                <div class="col-sm-5">
                    <input type="text" value="{$info->money}" name="money" id="money" class="form-control"
                           placeholder="请输入准入额">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">预设机器人</label>

                <div class="col-sm-5">
                    <input type="text" value="{$info->num}" name="num" id="num" class="form-control"
                           placeholder="请输入预设值">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">广告视频</label>

                <div class="col-sm-5">
                    <select name="type" id="video" class="form-control">
                        {foreach $video as $key=>$item}
                        <option {if $info.video == $item.id}selected{/if} value="{$item.id}">{$item.title}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">团购商品</label>

                <div class="col-sm-5">
                    <button type="submit" data-url="{:url('admin/shop/icon_link_form')}"
                            onclick="showGoods()" class="btn btn-primary">选择商品
                    </button>
                    <br/>
                    <div class="col-sm-5 goods_info">
                        {$info->goods_title}
                    </div>
                </div>

            </div>





            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" data-url="{:url('admin/game/roomEdit',['id'=>$info->id])}"
                            onclick="ajaxPosts(this)" class="btn btn-primary">确定修改
                    </button>
                </div>
            </div>
        </form>
    </div>
    {else /}
    <header class="panel-heading">
        <h4>添加文章</h4>
    </header>
    <div class="panel-body" style="padding-bottom: 50px">
        <form class="form-horizontal" method="post" onsubmit="return false" role="form">
            <div class="form-group">
                <label class="col-sm-2 control-label">标题</label>

                <div class="col-sm-5">
                    <input type="text" value="" name="name" id="name" class="form-control"
                           placeholder="请输入标题">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">分类</label>

                <div class="col-sm-5">
                    <select name="size" id="size" class="form-control">
                        {foreach $cate as $key=>$item}
                        <option value="{$item.id}">{$item.name}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">准入额</label>

                <div class="col-sm-5">
                    <input type="text" value="" name="money" id="money" class="form-control"
                           placeholder="请输入准入额">
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2 control-label">预设机器人</label>

                <div class="col-sm-5">
                    <input type="text" value="" name="num" id="num" class="form-control"
                           placeholder="请输入预设值">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">广告视频</label>

                <div class="col-sm-5">
                    <select name="type" id="video" class="form-control">
                        {foreach $video as $key=>$item}
                        <option value="{$item.id}">{$item.title}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">团购商品</label>

                <div class="col-sm-5">
                    <button type="submit" data-url="{:url('admin/shop/icon_link_form')}"
                            onclick="showGoods()" class="btn btn-primary">选择商品
                    </button>
                    <br/>
                    <div class="col-sm-5 goods_info">
                    </div>
                </div>

            </div>

            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" onclick="ajaxPosts(this);console.log($(this).parents('form').serialize())" data-url="{:url('admin/game/roomAdd')}"
                            class="btn btn-primary">提交
                    </button>
                </div>
            </div>
        </form>
    </div>
    {/if}
</section>
<div class="jconfirm jconfirm-material jconfirm-material2" style="display: none">
    <div class="jconfirm-bg seen" style="transition-duration: 0.5s; transition-timing-function: cubic-bezier(0.36, 1.1, 0.2, 1); opacity: 0.2;"></div>
    <div class="jconfirm-scrollpane">
        <div class="container">
            <div class="row">
                <div class="jconfirm-box-container col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1" style="width: 50%;margin-left: 25%;">
                    <div class="jconfirm-box" role="dialog" aria-labelledby="jconfirm-box30549" tabindex="-1" style="transition-duration: 0.5s; transition-timing-function: cubic-bezier(0.36, 1.1, 0.2, 1.2); margin-top: 250px; transition-property: transform, opacity, box-shadow, margin;">
                        <table class="table table-bordered table-striped no-margin">
                            <thead>
                            <tr>
                                <th class="text-center">
                                    <div style="" class="">选择</div>
                                </th>
                                <th class="text-center">
                                    <div style="" class="">商品名称</div>
                                </th>
                                <th class="text-center">
                                    <div style="text-align: center; width: 80px;" class="">价格</div>
                                </th>
                            </tr>
                            </thead>
                            <tbody>
                            {volist name="goodsList" id="list"}
                            <tr>
                                <td class="text-center" align="left">
                                    <input type="radio" name="id" value="{$list.id}" data-title="{$list.title}">
                                </td>
                                <td class="text-center" align="left">
                                    <div style="">{$list.title}</div>
                                </td>
                                <td class="text-center" align="left">
                                    <div style="text-align: center; width: 80px;">{$list.team_prices}</div>
                                </td>
                            </tr>
                            {/volist}
                            </tbody>
                        </table>

                        <div class="buttons" style="margin-top: 5px">

                            <button type="submit" class="btn btn-info" onclick="hideGoods()">确定</button>
                        </div>
                        <div class="jquery-clear"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}


{block name="footer"}
    <!--<script src="__PUBLIC__/admin/vendor/fuelux/radio.js"></script>-->
<script>




    {if isset($info)}
    var goodsInfo = {id:{:print_r($info->goods_id)},title: '{:print_r($info->goods_title)}'};
    {else}
    var goodsInfo = {id:0,title:''}
    {/if}


    function showGoods(){
        $('.jconfirm').show();
    }
    function hideGoods(){
        var e = $('input[name="id"]:checked');
        selectGoods(e.val(),e.attr('data-title'));
        $('.jconfirm').hide();
        $('.goods_info').html(goodsInfo.title);
    }
    function selectGoods(id,title){
        goodsInfo.id = id;
        goodsInfo.title =title;
    }


    function ajaxPosts(event) {
        var url = $(event).attr('data-url');
        var data = {
            name : $('#name').val(),
            size : $('#size option:selected').val(),
            video : $('#video option:selected').val(),
            money : $('#money').val(),
            num : $('#num').val(),
            goods_id : goodsInfo.id,
            goods_title : goodsInfo.title,
        }

        $.post(url,data,function(res){
            if(res.code == 1){
                main.waringAlert(res.message)
            }else{
                if (res.toUrl) {
                    window.location.href = res.toUrl;
                    return false;
                }else{
                    window.location.reload();
                    return false;
                }
            }
        })
    }



    if($('#category').val() != 2){
        $('.start_time_box').hide();
        $('.end_time_box').hide();
    }
    $('#category').on('change',function(){
        if($('#category').val() != 2){
            $('.start_time_box').hide();
            $('.end_time_box').hide();
        }else{
            // $('.start_time_box').show();
            // $('.end_time_box').show();
        }
    })
</script>
<script>
    laydate.render({
        elem: '#start_time',
        type: 'datetime'
    });
    laydate.render({
        elem: '#end_time',
        type: 'datetime'
    });
</script>
    <script>
        var E = window.wangEditor;
        var editor = new E('#editor');
        var $content = $('#content');
        editor.customConfig.uploadFileName = 'image'
        editor.customConfig.uploadImgServer = "{:url('upload/uploadEditor')}";
        editor.customConfig.onchange = function (html) {
            // 监控变化，同步更新到 textarea
            $content.val(html)
        };
        editor.customConfig.menus = [
            'head',  // 标题
            'bold',  // 粗体
            'fontSize',  // 字号
            'fontName',  // 字体
            'foreColor',  // 文字颜色
            'backColor',  // 背景颜色
            'link',  // 插入链接
            'list',  // 列表
            'justify',  // 对齐方式
            'quote',  // 引用
            'image',  // 插入图片
        ]
        editor.create()

        $(function(){
            $(".w-e-text-container").css('height','600px')
        })
    </script>
<script>
    var $list = $('#fileList');
    var uploader = WebUploader.create({
        auto: true,// 选完文件后，是否自动上传。
        swf: '/static/admin/js/webupload/Uploader.swf',// swf文件路径 换成你的接收路径
        server: "{:url('upload/uploadVideo')}",// 文件接收服务端 换成你的接收路径
        duplicate :true,// 重复上传图片，true为可重复false为不可重复
        pick: '#imgPicker',// 选择文件的按钮
        accept: {
            title: 'Images',
            extensions: 'gif,jpg,jpeg,bmp,png,mp4',
            mimeTypes: 'image/jpg,image/jpeg,image/png,video/mp4'
        },

        'onUploadSuccess': function(file, data, response) {
            var up_src = data._raw.replace("\\", "\/");
            var ph_src = JSON.parse(up_src);
            console.log(ph_src);
            ph_src = ph_src.data[0].replace("\/\/", "\/");
            ph_src = ph_src.replace("\\", "\/");

            //上传成功后显示图片
            var $li = $(
                '<div id="' + file.id + '" class="file-item thumbnail draggable-element d-"'+file.id.substr(file.id.length-1,1)+' style="position:relative;">' +
                '<img>' +
                '<a class="file-panel" href="javascript:;" onclick="remove(this)">' +
                '<span class="fa fa-close"></span>' +
                '</a>' +
                '<input type="hidden" id="data_photo" name="video" value="'+ph_src+'">' +
                '</div>'
                ),
                $img = $li.find('img');

            // $list为容器jQuery实例
            $list.append( $li );

            // 创建缩略图 如果为非图片文件，可以不用调用此方法 100（宽） x 100（高）
            uploader.makeThumb( file, function( error, src ) {
                if ( error ) {

                    $img.replaceWith('<video style="width:100%" src="'+ph_src+'" controls="controls">' +'您的浏览器不支持 video 标签。' +'</video>');
                    //$img.replaceWith('<span>不能预览</span>');
                    return;
                }
                $img.attr( 'src', src );
            }, 100, 100 );
        }
    });


    // 当有文件添加进来的时候
    uploader.on( 'fileQueued', function( file ) {

    });

    // 文件上传成功
    uploader.on( 'uploadSuccess', function( file ) {
        $( '#'+file.id ).find('p.state').text('上传成功！');
    });

    // 文件上传失败，显示上传出错。
    uploader.on( 'uploadError', function( file ) {
        $( '#'+file.id ).find('p.state').text('上传出错!');
    });

    /**
     * [remove 移除图片]
     * @post  [file]  [文件名 （必填）]
     * @post  [obj]  [操作对象] [前台操作数据 移除dom标志]
     *
     * @return
     * @Author[summer 1012684399@qq.com] THINK MORE DO LESS
     */
    function remove(obj){
        // console.log(12);

        $(obj).parent('div').remove();
        // var html = '<input type="hidden" id="data_photo" name="remove[]" value="">';
        // $('#fileList').append(html);
    }
</script>
{/block}